<template>
  <el-dialog
    :title="title"
    :visible.sync="dialogFormVisible"
    :show-close="false"
    :close-on-click-modal="false"
  >
    <el-form :model="form">
      <el-form-item label="班级Id" :label-width="formLabelWidth">
        <el-input v-model="form.classId" autocomplete="off" disabled>
          {{ zhuangtai }}
        </el-input>
      </el-form-item>
      <el-form-item label="班级名称" :label-width="formLabelWidth">
        <el-input v-model="form.className" autocomplete="off"> </el-input>
      </el-form-item>
    </el-form>
    <div slot="footer" class="dialog-footer">
      <el-button @click="closeClose">取 消</el-button>
      <el-button type="primary" @click="close">确 定</el-button>
    </div>
  </el-dialog>
</template>

<script>
export default {
  name: "mytab",
  props: ["zhuangtai", "changeData", "title"],
  data() {
    return {
      dialogTableVisible: false,
      kaig: false,
      form: {
        classId: "",
        className: "",
      },
      formLabelWidth: "120px",
    };
  },
  methods: {
    close() {
      if (this.title === "修改学生") {
        this.$emit("close");
        this.axios({
          method: "post",
          url: "/updateClass",
          data: {
            data: {
              className: this.form.className,
              classId: this.form.classId,
            },
          },
        }).then((data) => {
          this.$emit("updateTabData", data.data.data);
        });
      }
      else{
        this.$emit("close");
        this.axios({
          method: "post",
          url: "/changeClass",
          data: {
            data: {
              className: this.form.className,
            },
          },
        }).then((data) => {
          console.log(data)
          this.$emit("updateTabData", data.data.data);
        });
      }
    },
    closeClose() {
      this.$emit("close");
    },
  },
  computed: {
    dialogFormVisible() {
      (this.form.classId = this.changeData.classId),
        (this.form.className = this.changeData.className);
      return this.zhuangtai;
    },
    changeDatagaibian() {
      return {
        classId: this.changeData.classId,
        className: this.changeData.className,
      };
    },
  },
  watch: {
    zhuangtai() {
      this.kaig = this.zhuangtai;
    },
  },
};
</script>

<style lang="less"></style>
